<template>
    <div class="paper_detail">

        <article>
            <header>
                <h1>清明正是踏青好时节</h1>
                <div class="acticleInfo"><span>招生宣传服务中心</span> <span class="author">广东科技学院招生办</span>
                    <br>
                    <span>4月5日</span></div>
            </header>
            <br>
            <section v-for="item in contentList" style="padding:0px 0.5rem;">
                <div v-if="item.type=='img'" >
                    <img :src="item.content" style="border-radius: 4px;margin:20px 0px;">
                </div>
                <p v-if="item.type=='text'" style="padding:0 4px">
                    {{item.content}}
                </p>
            </section>
        </article>
        <br><br><br><br><br><br><br>
        <div class="comment_title">最新评论 </div>
        <comment :paperId="id"></comment>
    </div>
</template>

<script>
    import ltxService from '../services/LtxService'
    export default {
        props:['id'],
        name: "PaperDetail",
        mounted() {
            console.log(this.id)
            ltxService.getPaperDetail(this.id).then(resp=>{
                this.contentList=resp.data.data.contentList
            })
        },
        data(){
            return{
                showCommentEditor:false,
                contentList:[]
            }
        }
    }
</script>

<style lang="scss" scoped>
    .comment_title{
        padding: 0px 28px;
        font-size: 16px;
    }
    .paper_detail{
        color:#333;

        article{
            padding: 20px 16px 12px;
            color:rgb(63, 62, 63);
            font-size: 15px;

            section{
                letter-spacing:1px;
                padding: 4px;
                line-height: 24px;
            }
            header{
                h1{
                    font-size: 22px;
                    margin-bottom: 14px;
                line-height: 22px;
                }
                .acticleInfo{
                    span{
                        color: rgba(0,0,0,0.3);
                        margin: 0 15px 10px 0;
                        font-size: 15px;
                        line-height: 30px;
                    }
                    .author{
                        color: #576b95;
                    }
                }

            }
        }
    }

</style>